<template>
    <view class="add-moments">
        <Header>
            <template #left>
                <uni-icons @click="back" type="left" size="30"></uni-icons>
            </template>
            <template #right>
                <button type="primary" size="mini" @click="onPublish">发表</button>
            </template>
        </Header>
        <view class="add-content">
            <textarea placeholder="请输入" class="textarea" maxlength="-1" @blur="bindTextAreaBlur" auto-height/>
            <view class="upload">
                <uni-file-picker
                        v-model="imageValue"
                        fileMediatype="image"
                        mode="grid"
                        @select="select"
                        @progress="progress"
                        @success="success"
                        @fail="fail"
                        @delete="deleteImg"
                />
                <!--                        ref="files"-->
                <!--                        :auto-upload="false"-->
            </view>

        </view>
    </view>
</template>

<script setup lang="ts">
import {ref, type Ref} from 'vue'
import {Icon} from '@iconify/vue';
import {request} from '@/api/request'
import Header from '@/views/Header.vue'
import {onLoad, onShow} from '@dcloudio/uni-app';
import type {FriendDto} from '@/api/model/friend/FriendDto';
import Message from "@/pages/moments/view/Message.vue";

const token = ref('')
const imageValue = ref<any>([])
const friendList: Ref<FriendDto[]> = ref([])

onLoad(() => {
    findFriend()
})
const bindTextAreaBlur = (e: any) => {
    console.log(e.detail.value)
}
const onPublish = () => {
    uni.navigateBack({
        delta: 2
    })
}
const toAddFriend = () => {
    uni.navigateTo({
        url: '/pages/friend/find/find'
    })
}
const back = () => {
    uni.navigateBack({
        delta: 2
    })
}
const findFriend = async () => {
    const value = uni.getStorageSync('token');
    console.log('token' + token.value)
    // const operation = {
    //     method: 'GET',
    //     url: `/main/friend/findFriend`,
    //     data: '',
    //     tokenRequired: true // 新增，表示是否需要token
    // }
    // const res = await request(operation)
    // friendList.value = res.data.friend

}
// 获取上传状态
const select = (e: any) => {
    console.log('选择文件：', e)
    console.log(imageValue)
    console.log(imageValue.value)
    let {tempFiles} = e;
    tempFiles.forEach((element: any) => {
        let {name, url, uuid, file} = element;
        imageValue.value.push({
            name, url, uuid, file,
        })
    });
    console.log("图片：", imageValue.value)
}
// 获取上传进度
const progress = (e: any) => {
    console.log('上传进度：', e)
}

// 上传成功
const success = (e: any) => {
    console.log('上传成功')
}

// 上传失败
const fail = (e: any) => {
    console.log('上传失败：', e)
}
//删除
const deleteImg = (e: any) => {

    let {tempFile: {uuid}} = e
    let tar = imageValue.value.findIndex((element: {
        name: '',
        url: '',
        uuid: '',
        file: ''
    }) => element.uuid === uuid)
    if (typeof tar === 'number') {
        imageValue.value.splice(tar, 1)
    }
}
</script>


<style lang="scss">
.add-moments {
  overflow: hidden;

  .add-content {
    height: 86vh;
    overflow: scroll;
    //align-items: center;
    //text-align: center;

    .textarea {
      margin: 10px auto;
    }

    .upload {
      margin: 10px;
    }
  }
}
</style>
